﻿<!DOCTYPE html>
<html class="no-js" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="meta description">

    <title>订单</title>
  <link rel="shortcut icon" type="image/x-icon" th:href="@{/img/timg.jpg}" media="screen"/>
<!--== Google Fonts ==-->
<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,400i,500,600,700" rel="stylesheet">
<link rel="stylesheet" th:href="@{/css/alert.css}">
    <!--=== Bootstrap CSS ===-->
<link th:href="@{/assets2/css/vendor/bootstrap.min.css}" rel="stylesheet">
<!--=== Font-Awesome CSS ===-->
<link th:href="@{/assets2/css/vendor/font-awesome.css}" rel="stylesheet">
<!--=== Plugins CSS ===-->
<link th:href="@{/assets2/css/plugins.css}" rel="stylesheet">
<!--=== Helper CSS ===-->
<link th:href="@{/assets2/css/helper.min.css}" rel="stylesheet">
<!--=== Main Style CSS ===-->
<link th:href="@{/assets2/css/style.css}" rel="stylesheet">

<link rel="stylesheet" th:href="@{/css/default.css}">

<link rel="stylesheet" th:href="@{/css/singleShop.css}">
<!-- Modernizer JS -->
<script th:src="@{/assets2/js/vendor/modernizr-2.8.3.min.js}"></script>

  <!--[if lt IE 9]>
<script src="http://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="http://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>

<body>

<div th:insert="~{shopIndex::header}"></div>

<div class="page-breadcrumb-wrap">
  <div class="container">
    <div class="row">
      <div class="col-lg-12">
        <div class="page-breadcrumb">
          <ul class="nav">
            <li><a th:href="@{/shopIndex}">主页</a></li>
            <li><a th:href="@{/indent}">购物车</a></li>
            <li><a href="#" class="active">付款</a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>

<div id="page-content-wrapper">
  <div class="container">
    <!--== Checkout Page Content Area ==-->
    <div class="row">
      <div class="col-12">
       </div>
    </div>

    <div class="row">
      <!-- Checkout Billing Details -->
      <div class="col-lg-6">
        <div class="checkout-billing-details-wrap">
          <h2>选择地址</h2>
          <div class="billing-form-wrap">
            <div style="background-color: #cccccc" class="col-lg-6" th:each="adress:${addresses}">
              <button type="button" class="btn" style="float: right" th:onclick="'javascript:add('+${adress.getaId()}+','+${indent.getoId()}+')'">选择</button>
              <p><strong>收件人:[[${adress.getuName()}]]</strong></p>
              <p>手机号:[[${adress.getuPhone()}]]<br/>
                省份:[[${adress.getuAddressProvince()}]]<br/>
                城市:[[${adress. getuAddressDetail()}]]</p>
            </div>
          </div>
        </div>
      </div>

      <!-- Order Summary Details -->
      <div class="col-lg-6 mt-5 mt-lg-0">
        <div class="order-summary-details">
          <h2>订单详情</h2>
          <div class="order-summary-content">
            <!-- Order Summary Table -->
            <div class="order-summary-table table-responsive text-center">
              <table class="table table-bordered">
                <thead>
                <tr>
                  <th>商品信息</th>
                  <th>金额</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                  <td><a href="javascript:void(0);">[[${indent.getPhone().getpName()}]]<strong> × 1</strong></a></td>
                  <td th:text="${indent.getPhone().getpPrice()}"></td>
                </tr>
                </tbody>
                <tfoot>
                </tfoot>
              </table>
            </div>
          </div>

            <!-- Order Payment Method -->
            <div class="order-payment-method">
              <div class="single-payment-method">
                <div class="payment-method-name">
                  <div class="custom-control custom-radio">
                    <input type="radio" id="paypalpayment" name="paymentmethod" value="paypal" class="custom-control-input" checked />
                    <label class="custom-control-label" for="paypalpayment">支付宝</label>
                  </div>
                </div>
                <div class="payment-method-details" data-method="paypal">
                  <p>使用支付宝支付</p>
                </div>
              </div>
              <div class="summary-footer-area">
                <div class="custom-control custom-checkbox">
                  <input type="checkbox" class="custom-control-input" id="terms" required checked/>
                  <label class="custom-control-label" for="terms">我已阅读并同意网站的条款和条件。</label>
                </div>
                <form th:action="@{/alipay}" method="post">
                  <input type="hidden" id="oId" name="oId"/>
                  <input type="hidden" id="p_name" name="p_name"/>
                  <input type="hidden" id="money" name="money"/>
                  <input type="hidden" name="WIDbody" value="付款"/>
                  <button type="submit" class="btn">支付</button>
                </form>

              </div>
          </div>
        </div>
      </div>
    </div>
    <!--== Checkout Page Content End ==-->
  </div>
</div>


<div th:insert="~{shopIndex::footer}"></div>

<!-- Scroll to Top Start -->
<a href="#" class="scrolltotop"><i class="fa fa-angle-up"></i></a>
<!-- Scroll to Top End -->

<!--=======================Javascript============================-->
<!--=== Jquery Min Js ===-->
<script th:src="@{/assets2/js/vendor/jquery-3.3.1.min.js}"></script>
<!--=== Jquery Migrate Min Js ===-->
<script th:src="@{/assets2/js/vendor/jquery-migrate-1.4.1.min.js}"></script>
<!--=== Popper Min Js ===-->
<script th:src="@{/assets2/js/vendor/popper.min.js}"></script>
<!--=== Bootstrap Min Js ===-->
<script th:src="@{/assets2/js/vendor/bootstrap.min.js}"></script>
<!--=== Ajax Mail Js ===-->
<script th:src="@{/assets2/js/ajax-mail.js}"></script>
<!--=== Plugins Min Js ===-->
<script th:src="@{/assets2/js/plugins.js}"></script>

<!--=== Active Js ===-->
<script th:src="@{/assets2/js/active.js}"></script>
<script th:src="@{/js/bootstrap-paginator.js}"></script>
<script th:src="@{/js/alert.js}"></script>
<script th:inline="javascript">

  let oid = [[${indent.getoId()}]];
  let p_name = [[${indent.getPhone().getpName()}]];
  let money = [[${indent.getPhone().getpPrice()}]];

  function add(aid,oid) {
    $.ajax({
      url: "/order",
      type: "post",
      data: {
        aid: aid,
        oid: oid
      },
      dataType: "json",
      success: function (result) {
        if (result) {
          showMsg('选择地址成功！', 'top', 'successful');
        } else {
          showMsg('账号没登录，请登录！', 'top', 'error');
        }
      },
      error: function (result) {
        console.log(0)
      }
    });
  }

  function format(Date){
    var Y = Date.getFullYear();
    var M = Date.getMonth() + 1;
    M = M < 10 ? '0' + M : M;// 不够两位补充0
    var D = Date.getDate();
    D = D < 10 ? '0' + D : D;
    var H = Date.getHours();
    H = H < 10 ? '0' + H : H;
    var Mi = Date.getMinutes();
    Mi = Mi < 10 ? '0' + Mi : Mi;
    var S = Date.getSeconds();
    S = S < 10 ? '0' + S : S;
    return Y+""+M+""+D+""+H+""+Mi+""+S;
  }
  var nowDate = new Date();
  var payId = format(nowDate)+oid;
  $("#oId").val(payId);
  $("#p_name").val(p_name);
  $("#money").val(money);
</script>
</body>
</html>
